@import "../layout/_variables", "../layout/_mixin";
*{
  font:{
    family: $main-sec-ff;
  }
}
tbody{
  display:table-row-group;
  vertical-align: middle;
}
tr{
  display:table-row;
}
/*order status*/
.order-status{
  overflow: hidden;
  .order-bar{
    height: 45px;
    background: #f5f5f5;
    ul{
      li{
        width: 30%;
        height: 45px;
        margin-top: 1px;
        display: inline-block;
        float: left;
        text-align: center;
        background:url(/images/orders/detail-right.png) 100% 1px no-repeat;
        font:{
          size: 14px;
        }
        color: #808080;
        &.order-bar-active{
          color: $white;

          .order-bar-current{

            width: 180px;
            height: 49px;
            line-height: 49px;
            background: url(/images/orders/order-bg.png) 0  no-repeat;
            display: inline-block;
          }
          .order-point{
            width: 45px;
            height: 10px;
            margin: -16px auto;
            i{
              border-bottom: #33b6ff solid 17px;
              border-left: transparent solid 12px;
              border-right: transparent solid 12px;
              overflow: hidden;
            }
          }
        }
        span{
          height: 45px;
          line-height: 45px;
          display: block;
        }



      }
    }

  }
  .state-frame{
    padding: 25px 20px 25px 30px;
    background: $white;
    border: 1px solid #23beff;
    margin-top: 20px;
    h3{
      margin-bottom: 24px;
    }
    .status-text{
      li{
        line-height: 24px;
        a{
          color: #f05d66;
        }
      }
    }
  }


}

.detail-all{
  /*logistics information*/
  .logistics-inform{
    margin: 30px 0;

    .log-title{
      h3{
        width: 130px;
        height: 30px;
        line-height: 30px;
        background: #f58d0f;
        border-radius: 5px 5px 0 0;
        text-align: center;
        color: $white;
        margin-left: 20px;
      }
      border-bottom: 1px solid #ddd;
    }
    table{
      margin: 20px 0 0 20px;
      //margin-left: 30px;
      line-height: 25px;
      color: #333;
      .log-track{
        float: left;
      }
    }
  }
  /*Order information*/
  .order-information {
    .ord-title{
      h3{
        width: 130px;
        height: 30px;
        line-height: 30px;
        background: #f58d0f;
        border-radius: 5px 5px 0 0;
        text-align: center;
        color: $white;
        margin-left: 20px;
        float: left;
        font-size: 16px;
      }
      span{
        float: right;
        color: #77c9ff;
        padding-right: 20px;
      }
      height: 30px;
      border-bottom: 1px solid #ddd;

    }
    .ord-content{
      position: relative;
      display: block;
      border-bottom: 1px solid #e6e6e6;
      height: 145px;
      .ord-address{
        width: 738px;
        padding:20px 0 20px 20px;
        border-right: 1px solid #e6e6e6;
        float: left;

        dl{
          line-height: 35px;
          dt{
            float: left;
            width: 80px;
            font-weight: bold;
          }
        }
      }
      .ord-list{
        padding:20px;
        width: 300px;
        float: left;
        dl{
          line-height: 35px;

          dt{
            float: left;
            width: 80px;
            font-weight: bold;
          }
        }
      }
    }
    .seller-information{
      border-bottom: 1px solid #e6e6e6;
      .seller-inform-base{
        padding:20px 0 20px 20px;
        h3{
          margin-bottom: 20px;
        }
        table{
          tbody{
            tr{
              td{
                width: 356px;
                text-align: center;
                line-height: 30px;
                label{
                  width: 75px;
                }
              }
            }
          }
        }
      }
    }

  }
  /*shangpingshuxing*/
  .commodity-attribute{
    table{
      text-align: center;
      border-spacing:0;
      border-collapse:collapse;
      border: 1px solid #e6e6e6;
      width: 1100px;
      tbody{
        text-align: center;
        tr{

          &:nth-of-type(odd){
            height: 45px;
            background: #f5f5f5;
            th{
              color: #656565;
              padding: 8px 10px;
              word-wrap:break-word;
              text-align: center;
              &:nth-of-type(1){
                //width: 260px;
                //text-align: center;
              }

            }
          }
          td{
            height: 120px;
            //line-height: 120px;
            width: 122px;
            text-align: center;
            border-right: 1px solid #e6e6e6;
            &:nth-of-type(1){
              width: 355px;
              text-align: left;
            }
            .com-img{
              float: left;
              margin:0 8px 0 20px;
              width: 60px;
              height: 60px;
            }
            .com-text{
              width: 245px;
              float: left;
              line-height: 25px;
              a{
                color: #33b5ff;
              }

            }
            &:nth-of-type(2){
              $width1: 122px !global;
              width: $width1;

              p{
                color: #999;
                line-height: 25px;

              }
            }
            &:nth-of-type(3){
              width: 112px;
            }
            &:nth-of-type(3n+4){
              width: $width1;
            }
            &:nth-of-type(3n+5){
              width: $width1;
            }
            &:nth-of-type(3n+6){
              width: $width1;
              padding: 5px;
              ul{
                li{
                  list-style: disc;
                  text-align: left;
                  margin-left: 20px;
                  line-height: 22px;
                }
              }
            }
            &:nth-of-type(3n+7){
              line-height: 22px;
              width: 144px;
              padding: 5px;
            }
            svg{
              width: 18px;
              height: 18px;
              &.return{
                float: left;
                margin-right: 5px;
              }
              &.qa{

              }
            }



            .return-all{
              width: 55px;
              margin: 0 auto;


              .return-text{
                float: left;
                color: #6aa93b;
              }
            }
            .return-quality{
              padding-top: 28px;
            }
          }
        }
      }
    }

  }
  /*total*/
  .ord-total{
    margin: 20px 0 30px 0;
    text-align: right;
    font:{
      size: 12px;
    }
    color: #333;
    strong
    {
      color: #fb5e5e;
      font:{
        size: 18px;
      }
    }
  }


}